<html>
<head>
    <title>双预防系统</title>
    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
    <link rel="stylesheet" href="../../../style.css">
    <style>
        body {
            background: #F2F2F2;
        }

        .main-head {
            background: #fff;
            padding-left: 10px;
            padding-top: 10px;
            margin-bottom: 0px;
            border: solid 1px #fff;
        }

        .chart-outer {
            height: 200px;
        }
    </style>
</head>
<body>
<div class="page" id="page-monitor">
    <div class="page-title">安全监督检查,检查内容自定义</div>
    <div class="page-main" :style="{height:(height)+'px'}">
        <div class="main-head">
            <el-form :inline="true" size="small">
                <el-form-item label="行业">
                    <el-select class="inputW" v-model="bussinessType">
                        <el-option
                                v-for="item in BusinessList"
                                :key="item.cid"
                                :label="item.cname"
                                :value="item.cid">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" @click="search">查询</el-button>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" @click="addChild">新增</el-button>
                </el-form-item>
            </el-form>
        </div>
        <el-table :data="userData" :stripe="true" :border="true" size="mini" style="width: 100%;" height="660">
            <el-table-column type="index" label="序号" width="50" align="center">
            </el-table-column>
            <el-table-column prop="bussinessTypeName" label="行业类型">
            </el-table-column>
            <el-table-column prop="patrolcontent" label="巡检内容">
            </el-table-column>
            <el-table-column prop="startTime" label="创建时间">
                <template slot-scope="scope" v-if="scope.row.startTime">
                    <el-tag size="medium">{{scope.row.startTime.replace("T"," ").substr(0,10)}}</el-tag>
                </template>
            </el-table-column>
            <el-table-column prop="isPhotograph" label="是否强制拍照">
                <template slot-scope="scope">
                    <div v-if="scope.row.isPhotograph==0">
                        否
                    </div>
                    <div v-if="scope.row.isPhotograph==1">
                        是
                    </div>
                </template>
            </el-table-column>
            <el-table-column label="操作">
                <template slot-scope="scope">
                    <el-button @click="editChild(scope.row)" round size="small" icon="el-icon-edit"></el-button>
                    <el-button icon="el-icon-delete" round size="small" @click="delBtn(scope.row.Id)"></el-button>
                </template>
            </el-table-column>
        </el-table>
        <div class="">
            <el-pagination background layout="prev, pager, next" :pagesize="pagesize" :total="totalCount"
                           :current-page.sync="pageno" @current-change="ChangePage">
            </el-pagination>
        </div>
    </div>
    <el-dialog :title="editMod?'编辑内容':'新增内容'" :visible.sync="addFormVisible">
        <el-form :model="childForm" ref="childForm" :inline="true" style="margin-left: 55px">
            <el-form-item label="行业类型" :label-width="120" :rules="[
                             {required:true,message:'行业类型!',trigger:'blur'}
                            ]">
                <el-select v-model="childForm.bussinessType" filterable placeholder="请选择行业类型" style="width:200px;">
                    <el-option
                            v-for="item in BusinessList"
                            :key="item.cid"
                            :label="item.cname"
                            :value="item.cid">
                    </el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="巡检内容" :label-width="120" :rules="[
                             {required:true,message:'巡检内容!',trigger:'blur'}
                            ]">
                <el-input type="tel" v-model="childForm.patrolcontent"></el-input>
            </el-form-item>

            <el-form-item label="创建时间" :label-width="120" :rules="[
                             {required:true,message:'创建时间!',trigger:'blur'}
                            ]">
                <el-date-picker type="date" value-format="yyyy-MM-dd" v-model="childForm.startTime"
                                placeholder="日期"
                                class="itemW" style="width: 200px"></el-date-picker>
            </el-form-item>

            <!--<el-form-item label="是否强制拍照" :label-width="120" :rules="[-->
                             <!--{required:true,message:'是否强制拍照!',trigger:'blur'}-->
                            <!--]">-->
                <!--<el-radio v-model="childForm.isPhotograph" label="0" value="0" name="Accept">否</el-radio>-->
                <!--<el-radio v-model="childForm.isPhotograph" label="1" value="1" name="Accept">是</el-radio>-->
            <!--</el-form-item>-->
        </el-form>
        <span slot="footer" class="dialog-footer">
          <el-button style="text-align: center" @click="cancleChild()">取消</el-button>
          <el-button type="primary" @click="submitChild()" style="text-align: center">确定</el-button>
         </span>
    </el-dialog>
</div>

<!-- import Vue before Element -->
<script src="https://unpkg.com/vue/dist/vue.js"></script>
<!-- import JavaScript -->
<script src="https://unpkg.com/element-ui/lib/index.js"></script>


<script type='text/javascript' src='../../../assets/jquery-1.11.2.min.js' charset='utf-8'></script>
<script type='text/javascript' src='../../../assets/echarts.min.js' charset='utf-8'></script>
<script type='text/javascript' src='../../../js/common.js' charset='utf-8'></script>
<script type='text/javascript' src='../../../js/component.js' charset='utf-8'></script>

<script>

    var vuePage = new Vue({
        el: '#page-monitor',
        data: {
            userForm: {},
            childForm: {},
            addFormVisible: false,
            editMod: false,
            currentId: '',
            expandId: '',
            selectUid: '',
            number: 0,
            roleData: [],
            companyList: [],
            child: [],
            WorkData: [],
            DepartmentData: [],
            titleGradeData: [
                {GradeName: '局长', Id: 0},
                {GradeName: '分管局长', Id: 1},
                {GradeName: '分管科长', Id: 2},
                {GradeName: '普通职员', Id: 3}
            ],
            defaultProps: {
                label: 'Text',
                id: 'Id',
            },
            devTree: '',   //树形数据
            height: 500,
            filterText: '',
            pagesize: 10,
            pageno: 1,
            totalCount: 0,
            userData: [],
            BusinessList: [],
            userName: '',
            bussinessType: ''

        },
        methods: {
            delBtn(id) {
                this.$confirm('此操作将永久删除, 是否继续?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning',
                    center: true
                }).then(() => {
                    if (SiteConfig.account.id == id) {
                        this.$message({
                            type: 'error',
                            message: '无法删除总账户'
                        });
                        return;
                    }
                    HttpUtil.get('GovernmentPlan/PlanContentDelete', {Ids: id}).success((res) => {
                        if (res.state == 0) {
                            this.$message({
                                type: 'success',
                                message: '删除成功'
                            });
                            this.getUserList();
                        } else {
                            this.$message({
                                type: 'error',
                                message: '删除失败'
                            })
                        }
                    })
                }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: '已取消删除'
                    });
                });

            },
            saveBtn() {
                this.$refs.userForm.validate((valid) => {
                    if (valid) {
                        if (!(/^1[3456789]\d{9}$/.test(this.userForm.Telephone))) {
                            this.$message({
                                type: 'error',
                                message: '手机号码有误，请重填'
                            })
                            return;
                        }

                        HttpUtil.get('User/Update', this.userForm).success((res) => {
                            this.$message({
                                type: 'success',
                                message: '修改成功'
                            });
                            this.getUserList();
                        })
                    } else {
                        this.$message({
                            type: 'error',
                            message: '输入内容不能为空'
                        })
                    }
                });
            },
            editChild(row) {
                this.childForm = row;
                this.childForm.bussinessType = row.bussinessType.toString();
                this.childForm.isPhotograph = row.isPhotograph.toString();
                this.addFormVisible = true;
                this.editMod = true;
            },
            addChild() {
                this.addFormVisible = true;
                this.editMod = false;
                this.childForm = {};
            },
            checkPhone() {
                var phone = document.getElementById('phone').value;
                if (!(/^1[3456789]\d{9}$/.test(phone))) {
                    alert("手机号码有误，请重填");
                    return false;
                }
            },
            submitChild() {
                if (!this.childForm.bussinessType) {
                    this.$message({type: 'error', message: '行业类型不能为空'})
                    return;
                }
                if (!this.childForm.patrolcontent) {
                    this.$message({type: 'error', message: '巡检内容不能为空'})
                    return;
                }
                if (!this.childForm.startTime) {
                    this.$message({type: 'error', message: '创建时间不能为空'})
                    return;
                }
                if (!this.childForm.isPhotograph) {
                    this.$message({type: 'error', message: '是否强制拍照不能为空'})
                    return;
                }
                this.childForm.UserId = SiteConfig.account.id;
                if (vuePage.editMod) {
                    HttpUtil.get('GovernmentPlan/PlanContentUpdate', this.childForm).success((res) => {
                        this.$message({
                            type: 'success',
                            message: '修改成功'
                        });
                        this.addFormVisible = false;
                        this.childForm = {};
                        this.getUserList();
                    })
                } else {
                    HttpUtil.get('GovernmentPlan/PlanContentAdd', this.childForm).success((res) => {
                        if (res.state == 0) {
                            this.addFormVisible = false;
                            this.getUserList();
                            this.$message({
                                type: 'success',
                                message: '增加成功！'
                            });
                        } else {
                            this.$message({
                                type: 'error',
                                message: res.errMsg
                            });
                        }

                    })
                }
            },
            cancleChild() {
                this.childForm = {};
                this.addFormVisible = false;
            },
            getUserDetail(params) {
                HttpUtil.get('User/Detail', params).success((res) => {
                    this.userForm = res.data[0];
                    this.userForm.parentId += '';
                })
            },
            search: function () {
                this.getUserList();
            },
            ChangePage(page) {
                this.pageno = page;
                this.getUserList();
            },
            getUserList() {
                var param = {};
                if (this.bussinessType)
                    param.bussinessType = this.bussinessType;
                param.UserId = SiteConfig.account.id;
                param.pageno = this.pageno;
                param.pagesize = this.pagesize;
                HttpUtil.get('GovernmentPlan/PlanContentList', param).success((res) => {
                    if (res.state == 0) {
                        var userData = res.data;
                        var BusinessListData = this.BusinessList;
                        for (var i = 0; i < userData.length; i++) {
                            for (var j = 0; j < BusinessListData.length; j++) {
                                if (userData[i].bussinessType == BusinessListData[j].cid) {
                                    userData[i].bussinessTypeName = BusinessListData[j].cname;
                                }
                            }
                        }
                        this.userData = userData;
                    } else {
                        this.$message({
                            type: 'error',
                            message: res.errMsg
                        })
                    }
                });
            },
        },
        watch: {
            filterText(val) {
                this.$refs.tree.filter(val);
            }
        },
        created: function () {
            this.height = window.innerHeight - 45;

            HttpUtil.get('CodeController/BusinessList').success((r) => {
                if (r.state == 0) {
                    vuePage.BusinessList = r.data;
                    vuePage.BusinessList.splice(0, 0, {
                        Controlflag: "1",
                        YX_ID: "",
                        c_seqno: null,
                        cflag: null,
                        cid: "",
                        cmemo: "Business22",
                        cname: "未选行业",
                        maxLevel: 1,
                        pid: "Business",
                        useflag: "1",
                    });
                    this.getUserList();
                }
            })
        },
        mounted: function () {

        }
    });


</script>

</body>
</html>
